@import "./mixin/color";
@import "./var";
// .gs-date--info{
//   border: 1px solid $--color-info;
//   font-size: 1rem;
//   &:hover{
//     @include borderCol("info");
//     box-shadow: 0 0 0 0.125em $--color-info;
//   }
// }
.gs-date--date {
    width: 200px;
    cursor: pointer;
}

.gs-date--box {
    position: relative;
    .gs-date--dialog {
        // @include drop(); //添加下拉动画
        position: absolute;
        top: 0px;
        left: 0px;
        margin-top: 45px;
        border: 1 solid blue;
        box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
        background-color: #ffffff;
        border-radius: 4px;
        width: 380px;
        .gs-date-month-title {
            // border-bottom: 1px solid RGB(192, 192, 192);
            .gs-date-month--box {
                display: flex;
                .gs-date-month--div {
                    flex: 1;
                    text-align: center;
                    font-size: 14px !important;
                    @each $light in (dark, primary, success, warning, danger, info, round, while) {
                        &.gs-date-month-title--#{$light} {
                            @include bgc($light);
                            
                        }
                    }
                }
                @each $light in (dark, primary, success, warning, danger, info, round, while) {
                    .gs-date-month--#{$light} {
                        @include fontcol($light);
                        // @include border($light);
                        cursor: pointer;
                    }
                    .gs-date-month--#{$light}:hover {
                        transform: scaleX(1.3) scaleY(1.3);
                        font-weight: 800;
                    }
                    .gs-date-month--#{$light}:active {
                        transform: scaleX(1.5) scaleY(1.5);
                        font-weight: 800;
                    }
                    .gs-date-month--#{$light}[redio=true] {
                        transform: scaleX(1.3) scaleY(1.3);
                        // @include bgc($light);
                        font-weight: 800;
                        // @include fontcol(while);
                    }
                }
            }
        }
        .gs-date-year--box {
            display: flex;
            flex-direction: row;
            position: relative;
            align-items: center;
            .gs-date-year--right {
                position: absolute;
                right: 10px;
                option {
                    font-size: 16px;
                    padding: .4em .8em;
                    font-weight: normal;
                    white-space: pre;
                    min-height: 1.1em;
                    cursor: pointer;
                }
                @each $light in (dark, primary, success, warning, danger, info, round, while) {
                    .gs-date-option--#{$light} {
                        @include fontcol($light);
                    }
                    .gs-date-option--#{$light}:hover {
                        transform: scaleX(1.4) scaleY(1.4);
                    }
                    .gs-date-select--#{$light} {
                        @include border($light);
                        outline: none;
                    }
                }
            }
        }
    }
}

.gs-date--day {
    & div {
        width: 35px!important;
        height: 35px!important;
        line-height: 35px !important;
        /*设置line-height与父级元素的height相等*/
        text-align: center;
        /*设置文本水平居中*/
    }
}

.gs-date--day {
    @each $light in (dark, primary, success, warning, danger, info, round, while) {
        &.gs-date-day--#{$light} div {
            @include fontcol($light);
            cursor: pointer;
        }
        &.gs-date-day--#{$light} td div:hover {
            @include border($light);
            @include bgc($light);
            @include fontcol(while);
            @include textsize(big);
            transform: scaleX(1.3) scaleY(1.3);
        }
    }
}